<template>
    <div class="option_head">

        <el-page-header title="返回" @back="backFun" class="option_top_header">
        </el-page-header>

        <el-input class="input_item" v-model="ks_username" placeholder="Please input" clearable>
            <template #prepend>科师空间账号</template>
        </el-input>
        <el-input class="input_item" v-model="ks_password" placeholder="Please input" type="password" show-password>
            <template #prepend>科师空间密码</template>
        </el-input>
        <div class="option_div">
            <span class="span_t">自动填报体温</span>
            <el-switch class="switch_t" v-model="bot_on"/>
        </div>
        <div class="option_button_div">
            <el-button class="option_button" type="primary" disabled>测试</el-button>
            <el-button @click="save_data()" class="option_button" type="primary" :disabled="this.save_cd">{{ this.save_text }}</el-button>
        </div>
    </div>
</template>

<script>
    import axios from "axios";
    import Qs from "qs";
    import {ElLoading, ElMessage} from "element-plus";

    export default {
        name: "Option",
        data(){
            return {
                ks_username: void 0,
                ks_password: void 0,
                bot_on: false,
                save_cd: false,
                save_text: "保存"
            }
        },
        methods: {
            save_data(){
                let _this = this
                this.save_cd = true
                this.save_text = '冷却中'
                setTimeout(function () {
                    _this.save_cd = false
                    _this.save_text = '保存'
                }, 5000)

                // 初始化加载动画
                const loading = ElLoading.service({
                    lock: true,
                    text: 'Loading',
                    background: 'rgba(0, 0, 0, 0.7)',
                })

                axios.post('/user/api/save_user_ks_info_api', Qs.stringify({
                    "ksname": _this.ks_username,
                    "kspassword": _this.ks_password,
                    "botopen": _this.bot_on
                }))
                    .then(function (response) {

                        // 获取response时，5秒后终止加载动画
                        setTimeout(() => {
                            loading.close()
                        }, 500)

                        if (response.data[0] === '1'){
                            ElMessage({message: "保存成功", type: 'success'})
                        }
                        else {
                            ElMessage({message: response.data[1], type: 'error'})
                        }
                    })
                    .catch(function (error) {

                        // 出现异常时，0.5秒后终止加载动画
                        setTimeout(() => {
                            loading.close()
                        }, 500)

                        console.log(error);
                        ElMessage({message: "服务器异常，保存失败", type: 'error'})
                    });

                // 5秒后终止加载动画
                setTimeout(() => {
                    loading.close()
                }, 5000)
            },
            backFun(){
                window.location.href = '/user/home'
            },
        },
        mounted() {
            let _this = this;
            window.onload = function () {
                const loading = ElLoading.service({
                    lock: true,
                    text: 'Loading',
                    background: 'rgba(0, 0, 0, 0.7)',
                })
                let this_ = _this;
                axios.post('/user/api/get_user_ks_info_api')
                    .then(function (response) {
                        let user_data = response.data
                        this_.ks_username = user_data.ksname
                        this_.ks_password = user_data.kspassword
                        if (user_data.botopen === 1){
                            this_.bot_on = true
                        }
                        console.log(this_.ks_username);
                        console.log(this_.ks_password);
                        console.log(this_.bot_on);
                        setTimeout(() => {
                            loading.close()
                        }, 500)
                    })
                    .catch(function (error) {
                        console.log(error);
                        ElMessage({message: "服务器异常，获取用户信息失败", type: 'error'})
                    });
                setTimeout(() => {
                    loading.close()
                }, 5000)
            }
        }
    }
</script>

<style scoped>
    @import "../assets/css/option.css";

</style>